Skip to content

[feat] add header userInfo #13

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. Weโ€™ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Merged
devmanta merged 6 commits into from
Nov 16, 2024
Merged

[feat] add header userInfo #13

devmanta merged 6 commits into from
Nov 16, 2024

Conversation

@devmanta
Copy link
Collaborator

@devmanta devmanta commented Nov 16, 2024

๐Ÿ“Œ Related Issue

#5

๐Ÿ“ Description

  • ํ—ค๋” ์‚ฌ์šฉ์ž์ •๋ณด ํ‘œ์‹œ + ๋ฐ์Šคํฌํƒ‘ ๋ชจ๋“œ์ผ๋•Œ ์‚ฌ์ด์ฆˆ ๊นœ๋นก๊ฑฐ๋ฆผ์ด ์žˆ์–ด์„œ ์Šค์ผˆ๋ ˆํ†ค์œผ๋กœ ์˜์—ญ ์žก๊ธฐ ์ถ”๊ฐ€
  • ํŒŒ๋น„์ฝ˜ ์ถ”๊ฐ€, title ์ˆ˜์ •

๐Ÿ“ธ Screenshot

image image

@devmanta
Copy link
Collaborator Author

devmanta commented Nov 16, 2024

์™œ ๋•Œ๋ฌธ์ธ์ง€ ์ถฉ๋Œ์ด ๋‚ฌ์Šต๋‹ˆ๋‹ค..? ๋‚ด๊ฐ€ ์˜ฌ๋ ค์„œ ๋‚ด๋ธŒ๋žœ์น˜ ๊ณ„์† ์ž‘์—…ํ•œ๊ฑด๋ฐ...
๊ทธ๋ž˜์„œ merge๋ผ๋Š” ์ปค๋ฐ‹์ด ๋ฐœ์ƒํ–‡์Šต๋‹ˆ๋‹ค..

devmanta
devmanta commented Nov 16, 2024
View reviewed changes
src/app/(with-header-sidebar)/dashboard/[id]/page.tsx
Copy link
Collaborator Author

@devmanta devmanta Nov 16, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@21ow ์ง€์œค๋‹˜ ์ด๊ฑฐ ์ œ๊ฐ€ ์ถ”๊ฐ€ํ•ด๋†“์„๊ฒŒ์š” ์•„์ง ๋Œ€์‹œ๋ณด๋“œ์ชฝ์ž‘์—… ์•ˆํ•˜์‹ ๊ฒƒ๊ฐ™์•„์„œ
์™ผ์ชฝ ์•„์ด์ฝ˜ ๋ˆ„๋ฅด๋ฉด ๋Œ€์‹œ๋ณด๋“œ ํ™”๋ฉด ์ž˜๋œจ๋‚˜ ํ…Œ์ŠคํŠธ์šฉ์œผ๋กœ ๋กœ์ปฌ์—์„œ๋งŒ ์ผ์—ˆ๋Š”๋ฐ ์š”๊ฑฐ ๊ฐ€์ ธ๋‹ค ์“ฐ์‹œ๋ฉด ๋ ๊ฒƒ๊ฐ™์Šต๋‹ˆ๋‹ค!

devmanta
devmanta commented Nov 16, 2024
View reviewed changes
src/components/Button.module.css
font-size: 14px;
font-weight: 600;
color: var(--white);
white-space: nowrap;
Copy link
Collaborator Author

@devmanta devmanta Nov 16, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

์ด๊ฑฐ ๋ฒ„ํŠผ ๊ธ€์ž ๋งŽ์•„์ง€๋ฉด(?) ์ค„๋ฐ”๊ฟˆ ๋˜๋”๋ผ๊ตฌ์š”
๊ธฐ๋ณธ์œผ๋กœ ์•ˆ์ค„๋ฐ”๊ฟˆํ•˜๋ฉด ์ข‹์„๊ฒƒ๊ฐ™์•„ ์ถ”๊ฐ€ํ–ˆ์–ด์š”!

devmanta
devmanta commented Nov 16, 2024
View reviewed changes
src/components/Header.tsx
}

export default function Header() {
export default function Header({ component: Component }: HeaderProps) {
Copy link
Collaborator Author

@devmanta devmanta Nov 16, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ํ—ค๋”์— ๋ณด๋ฉด ๋Œ€์‹œ๋ณด๋“œ์ชฝ์—๋งŒ ์‚ฌ๋žŒ๋“ค์•„์ด์ฝ˜..? ์žˆ๋Š”๊ฒŒ ์žˆ์–ด์„œ
์ด๋ถ€๋ถ„์€ ๋จธ๊ฐ€์˜ฌ์ง„ ๋ชจ๋ฅด์ง€๋งŒ~ ์ปดํฌ๋„ŒํŠธ๋ฅผ props๋กœ ๋ฐ›๋Š” ๋ฐฉ๋ฒ•์œผ๋กœ
์ปดํฌ๋„ŒํŠธ ์ฑ„์šฐ๋Š” ํ˜•์‹์ด ์ข‹์„๊ฒƒ๊ฐ™์•„ ์ถ”ํ›„์ž‘์—…์šฉ์œผ๋กœ ์ƒ๊ฐํ•ด์ฃผ์‹œ๋ฉด ๋ ๊ฒƒ๊ฐ™์Šต๋‹ˆ๋‹ค

devmanta
devmanta commented Nov 16, 2024
View reviewed changes
src/components/UserInfo.tsx
'use client';

import type { User } from '@/app/(with-header-sidebar)/mydashboard/types/user';
import styles from './UserInfo.module.css';
Copy link
Collaborator Author

@devmanta devmanta Nov 16, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

์–˜ ๋˜ ์œ„๋กœ๊ฐ“๋„ค.. ๋‹ด์— ๋‚˜์ค‘์— ๋‚ด๋ฆด๊ฒŒ์š”~!

devmanta
devmanta commented Nov 16, 2024
View reviewed changes
src/components/Header.tsx
return <header className={styles.header}>๋‚ด ๋Œ€์‹œ๋ณด๋“œ</header>;
return (
<header className={styles.header}>
<span className={styles.title}>๋‚ด ๋Œ€์‹œ๋ณด๋“œ</span>
Copy link
Collaborator Author

@devmanta devmanta Nov 16, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

h2 ์“ฐ๋Š”๊ฒŒ ์ข‹์•„๋ณด์ด๋„ค์š” ์ถ”ํ›„ ์ˆ˜์ • ใ„ฑใ„ฑ (์…€ํ”„ ์ฝ”๋“œ๋ฆฌ๋ทฐ..ใ…‹ใ…‹ใ…‹ใ…‹ใ…‹ใ…‹)

najitwo
najitwo approved these changes Nov 16, 2024
View reviewed changes
Copy link
Owner

@najitwo najitwo left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

๊ณ ์ƒํ•˜์…จ์Šต๋‹ˆ๋‹ค~
์ฝ”๋ฉ˜ํŠธ ๋‹ฌ๊ฒŒ ํฌ๊ฒŒ ์—†๋„ค์š”...๐Ÿ˜Š

src/components/Header.tsx
<div className={styles.userInfoContainer}>
<div className={styles.userInfoWrapper}>
<UserInfo />
</div>
Copy link
Owner

@najitwo najitwo Nov 16, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

userInfoContainer, userInfoWrapper ๋‘˜๋‹ค

display: flex;
align-items: center;

์ด ์†์„ฑ์„ ๊ฐ€์ง€๊ณ  ์žˆ๋Š”๋ฐ ์ด๋ ‡๊ฒŒ ํ•˜์‹  ์ด์œ ๊ฐ€ ๋ญ”๊ฐ€์š”?

Copy link
Collaborator Author

@devmanta devmanta Nov 16, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@najitwo ์ด๊ฒŒ.. ์ œ๊ฐ€ ํŒŒ์ดํ”„๋ผ์ธ ์ €๊ฑฐ๋ฅผ ๋”ฐ๋กœ ํƒœ๊ทธ์š”์†Œ ์ถ”๊ฐ€์•ˆํ•˜๊ณ  before ๊ฐ€์ƒํด๋ž˜์Šค ์‚ฌ์šฉํ•ด์„œ ํ‘œ์‹œ๋ฅผ ํ•˜๊ณ  ์‹ถ์—ˆ๋Š”๋ฐ
๊ทธ๋ ‡๊ฒŒ ํ•˜๋‹ค๊ฐ€.. ๊ทธ ํŒŒ์ดํ”„๋ž‘ ์ด๋ฏธ์ง€ ์‚ฌ์ด์˜ ๊ฐญ์„ margin์„ ์ค˜์„œ ์ฒ˜๋ฆฌํ–ˆ๋Š”๋ฐ ๊ทธ๋ž˜์„œ div๊ฐ€ ์ถ”๊ฐ€๋˜๋‹ˆ๊นŒ ์ •๋ ฌ์ด ๋˜ ์•ˆ๋งž์•„์„œ..
container๊บผ๋ฅผ ์ง€์šฐ๋ฉด before๊ฐ€์ƒ์š”์†Œ ์“ด๊ฒŒ ํ‹€์–ด์ง€๊ณ 
wrapper๊บผ ์ง€์šฐ๋ฉด userInfo์ชฝ์ด ํ‹€์–ด์ง€๊ณ  ๐Ÿค—
๊ทธ๋ž˜์„œ ๊ฒฐ๋ก ์ด ์ด๋ ‡๊ฒŒ ๋‚˜๋ฒ„๋ ธ์Šต๋‹ˆ๋‹ค
ํ˜น์‹€ ๋” ์Œˆ๋ฐ•ํ•œ ๋ฐฉ๋ฒ•์ž‡์œผ๋ฉด ํ•œ์ˆ˜...๋ฐฐ์›Œ๋ณด๊ฒŸ์Šต๋‹ˆ๋‹ค ๐Ÿซก

Copy link
Owner

@najitwo najitwo Nov 16, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

์˜ค... ์ง์ ‘ ํ•˜๋Š”๊ฑฐ ์•„๋‹ˆ๋ฉด ๊ฐ์ด ์•ˆ์žกํžˆ๋„ค์š” ใ…‹ใ…‹ใ…‹ใ…‹
๋‚˜์ค‘์— ํ•œ๋ฒˆ ๋ณด๊ฒ ์Šต๋‹ˆ๋‹ค! ๐Ÿ˜Ž

@devmanta devmanta merged commit 7e220f4 into develop Nov 16, 2024
@devmanta devmanta self-assigned this Nov 16, 2024
@devmanta devmanta added ๐ŸŽจHTML&CSS Issues or tasks specifically related to HTML structure or CSS styling โœจFeature Request for a new feature or functionality labels Nov 16, 2024
najitwo pushed a commit that referenced this pull request Nov 18, 2024
@devmanta @najitwo
[feat] add header userInfo (#13)
b034f73 
* โœจ feat: add header and sidebar css and types

* ๐Ÿฑ style: add favicon and title

* ๐Ÿ’„ style: add header button css

* ๐Ÿ’„ style: add header button icon

* โœจ feat: add userInfo component with skeleton
najitwo pushed a commit that referenced this pull request Nov 23, 2024
@devmanta @najitwo
[feat] add header userInfo (#13)
521d1b6 
* โœจ feat: add header and sidebar css and types

* ๐Ÿฑ style: add favicon and title

* ๐Ÿ’„ style: add header button css

* ๐Ÿ’„ style: add header button icon

* โœจ feat: add userInfo component with skeleton
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@najitwo najitwo najitwo approved these changes

Assignees

@devmanta devmanta

Labels

โœจFeature Request for a new feature or functionality ๐ŸŽจHTML&CSS Issues or tasks specifically related to HTML structure or CSS styling

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

3 participants

@devmanta @najitwo